import {WeaCheckbox} from 'ecCom';
import isFunction from 'lodash/isFunction';
import {createReplyBottomAtt,imgZoom, createAttachLi} from '../../util/communicationUtil';
import CommunicationRichText from './CommunicationRichText';
import ReplyList from './ReplyList';
import {message, Modal} from 'antd';
import {WeaLocaleProvider} from 'ecCom';
import * as mobx from 'mobx'
const getLabel = WeaLocaleProvider.getLabel;

class ContentItem extends React.Component {
  
  constructor(props) {
    super(props);
    this.state = {
      edit: false,
      editType: '',
      editValues: {},
      value: '1',
      passRichValue:getLabel('519983', "评论内容")
    }
  }
  
  edit = () => {
    const {contentInfo = {}} = this.props
    const {
      relatedaccList4E9 = [], 
      relatedcusList4E9 = [], 
      relateddocList4E9 = [], 
      relatedprjList4E9 = [], 
      relatedwfList4E9 = [], 
      relatemutilprjs4E9 = []
    } = contentInfo;
    this.setState({
      edit: true,
      editType: 'edit',
      editValues: {
        richValue: contentInfo.showRemark,
        relatedaccList4E9,
        relatedcusList4E9,
        relateddocList4E9,
        relatedprjList4E9,
        relatedwfList4E9,
        relatemutilprjs4E9
      }
    });
    
  }
  del = () => {
    let that = this;
    Modal.confirm({
      content: (
        <div className="wea-list-confirm">
          <p>{getLabel(388758, "确认要删除吗？")}</p>
        </div>
      ),
      onOk() {
        let {value} = that.state;
        that.setState({edit : false});
        that.operate("delContent",value);
      }
    });
  }


  comment = () => {
    this.setState({
      edit: true,
      editType: 'comment',
    });
  }
  
  //操作类型(dotop:置顶;canceltop:取消置顶;doApproveDiscuss:审批协作留言;collect:收藏;delComment:删除评论;delDiscuss:删除交流;agree:赞)
  operate = (type,value) => {
    const { logid } = this.props;
    isFunction(this.props.operate) && this.props.operate({
      id: this.props.contentInfo.contentId,
      operationType: type,
    }, logid);
  }
  
  submit = (params, callback) => {
    let { editType } = this.state;
    const { contentInfo } = this.props;
    let saveParams = {...params};
    saveParams.replyType = editType;
    saveParams.contentId = contentInfo.contentId;
    return isFunction(this.props.submit) && this.props.submit(saveParams, this.cancel.bind(this,callback));
  }
  cancel = (callback) => {
    this.setState({
      edit: false,
      editType: '',
      editValues: {},
      quoteFlag: false
    });
    isFunction(callback) && callback();
  }
 


 createBottomOperate = (text, icon, func) => {
  return (
    <span className="icon" onClick={func}>
      <i className={icon}/>
      <span className="text">{text}</span>
    </span>
  );
}


render() {
  const { contentInfo,isFromPortal, appStatus, submit, operate, logid, logParams,isprint='0', hasSubmitRight=false } = this.props;
  const { createUserType = '1', createUser } = contentInfo;
  let {edit, editType, editValues, passRichValue} = this.state;
  let headerProps = {diameter: 40, name: contentInfo.createUserName, src: contentInfo.userUrl};
  const replyList = mobx.toJS(contentInfo.replys);
  
  return (
    <div className="wea-comment-item">
      {
        (!edit || editType != 'edit') 
        && <div>
            <div className="cowork-reply-content">
              <div className='comment-content-wrap'>
                <div className='cowork-reply-user'>
                  { createUserType == '1' &&  <a href={`javaScript:openhrm(${contentInfo.createUser});`} onClick={window.pointerXY}>{contentInfo.createUserName}</a>}
                  { createUserType == '2' &&  <a href={`javaScript: window.open('/spa/crm/static/index.html#/main/crm/customerView?customerId=${contentInfo.createUser}&_key=jfzmyh', '_blank')`}>{contentInfo.createUserName}</a>}
                </div>
                <div className="cowork-reply-remark">
                  <div
                    className="wea-cl-content"
                    dangerouslySetInnerHTML={{__html: `<div class="wea-ckeditor-content">${contentInfo.showRemark}</div>`}}
                  />
                </div>
                <div className="workflow-resource-list">
                  {createReplyBottomAtt(getLabel(857, '相关文档')+':',contentInfo.relateddocList4E9, ()=>{}, "doc")}
                  {createReplyBottomAtt(getLabel(1044, '相关流程') + ':',contentInfo.relatedwfList4E9, ()=>{}, "wf")}
                  {createReplyBottomAtt(getLabel(783, '相关客户') + ':',contentInfo.relatedcusList4E9, ()=>{}, "crm")}
                  {createReplyBottomAtt(getLabel(782, '相关项目') + ':',contentInfo.relatemutilprjs4E9, ()=>{}, "project")}
                  {createReplyBottomAtt(getLabel(33414, '相关任务')+':',contentInfo.relatedprjList4E9, ()=>{}, "task")}
                  {createReplyBottomAtt(getLabel(33414, '相关附件')+':',contentInfo.relatedaccList4E9, ()=>{}, "acc")}
                </div>
                <div className='bottom-operate'>
                  <span className="reply-time">{contentInfo.showDate}</span>
                  <div className="fr">
                    { !isFromPortal && hasSubmitRight && contentInfo.isDelete != 1 && contentInfo.canModify && isprint == '0' && this.createBottomOperate(getLabel(93, '编辑'), 'icon-cooperation-edit', this.edit)}
                    { !isFromPortal && hasSubmitRight && contentInfo.isDelete != 1 && contentInfo.canModify && isprint == '0' && this.createBottomOperate(getLabel(91, '删除'), 'icon-cooperation-delete', this.del)}
                    {!isFromPortal && hasSubmitRight && contentInfo.isDelete != 1 && isprint == '0' && this.createBottomOperate(getLabel(675, '评论'), 'icon-coms-New-SMS', this.comment)}
                  </div>
                  <div className="clear-both" />
                </div>
              </div>
              {
                Array.isArray(replyList) 
                && replyList.length > 0
                && <ReplyList ecId={`${this && this.props && this.props.ecId || ''}_ReplyList@iuk1rp`} 
                    appStatus={this.props.appStatus} 
                    contentId={contentInfo.contentId} 
                    operate={this.props.operate} 
                    list={replyList} 
                    submit={this.props.submit}  
                    logParams={logParams}
                    logid={logid}
                    isprint={isprint}
                    isFromPortal={isFromPortal}
                    hasSubmitRight={hasSubmitRight}
                  />
                }
            </div>
        </div>
      }
      {
        edit  
        && isprint == '0'
        && <CommunicationRichText ecId={`${this && this.props && this.props.ecId || ''}_CommunicationRichText@gk1s75`} 
            appStatus={this.props.appStatus} 
            hasSubmit={true} 
            ref="richText" 
            submit={this.submit} 
            cancel={this.cancel}
            editType={editType}
            {...editValues}
            placeholder={passRichValue}
            logParams={logParams}
          />
      }
     
    </div>
  );
}
}
export default ContentItem;